<%@page import="com.bionic.banking.logic.controller.BankAccountController" errorPage="../error.jsp" %>
<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>List Of Persons</title>   

        <link rel="stylesheet" href="../resources/css/demos.css">               
        <link rel="stylesheet" href="../resources/themes/cupertino/jquery-ui.css" />                    

        <script type="text/javascript" src="../resources/script/jquery.min.js"></script>
        <script type="text/javascript" src="../resources/script/ui/jquery-ui.min.js"></script>
        
        <!--script type="text/javascript" language="javascript" src="../resources/script/jquery.js"></script>
	<script type="text/javascript" language="javascript" src="../resources/script/jquery.dataTables.js"></script-->
                
        <script type="text/javascript" >   
            var asInitVals = new Array();            
            $(function() {                        
                $("#minDateFilter").datepicker({ showButtonPanel: true });
                $("#maxDateFilter").datepicker({ showButtonPanel: true });                           
                
                var oTable = $('#tblList').dataTable({
                    "oLanguage": {
			"sSearch": "Search all columns:"
                    }
                } );                
                
              /*
               * Support functions to provide a little bit of 'user friendlyness' to the textboxes in 
               * the footer
               */
               $("thead input").keyup( function () {
                        /* Filter on the column (the index) of this element */
                        oTable.fnFilter( this.value, $("thead input").index(this) );
               });
                
               $("thead input").each( function (i) {
                       asInitVals[i] = this.value;
               });

               $("thead input").focus( function () {
                       if ( this.className == "search_init" )
                       {
                               this.className = "";
                               this.value = "";
                       }
               });

               $("thead input").blur( function (i) {
                       if ( this.value == "" )
                       {
                               this.className = "search_init";
                               this.value = asInitVals[$("thead input").index(this)];
                       }
               });
        
                /* Add event listeners to the two range filtering inputs */
		$('#minDateFilter').keyup( function() { oTable.fnDraw(); } );
		$('#maxDateFilter').keyup( function() { oTable.fnDraw(); } );
            });
            
            function viewRecord(id)
            {                                       
                var f=document.forms[0];                                
                f.method="post";                                
                //f.action='../banktransaction/View.jsp?id='+id;                                
                f.action='Controller?command=viewBankTransaction&id='+id;
                f.submit();
            }
            
           $.fn.dataTableExt.afnFiltering.push(
	     function( oSettings, aData, iDataIndex ) 
             {
		var iMin = document.getElementById('minDateFilter').value * 1;
		var iMax = document.getElementById('maxDateFilter').value * 1;
		var iVersion = aData[3] == "-" ? 0 : aData[3]*1;
		if(iMin == "" && iMax == "")
		{
			return true;
		}
		else if(iMin == "" && iVersion < iMax )
		{
			return true;
		}
		else if(iMin && "" == iMax )
		{
			return true;
		}
		else if (iMin <iVersion && iVersion < iMax )
		{
			return true;
		}
		return false;
              }
            );
        </script>
    </head>
    <body  id="dt_example">
        <h3>Bank Transactions List</h3>                 
        <form action="../Controller" method="post">        
            <input type="hidden" name="command" value ="viewTransactionsList"/>    
            <jsp:useBean id="domainHelperBean" class="com.bionic.banking.logic.DomainUtil" />
            <jsp:useBean id="bankTransactionsBean" scope="page"
                         class="com.bionic.banking.logic.controller.BankTransactionController" />  
            <jsp:useBean id="bankTransactionsTypeBean" 
                         class="com.bionic.banking.logic.controller.BankTransactionTypeController" />
            <div id="demo">                                 
                <table id="tblList" border="3">
                    <thead>
                        <tr>
                            <th bgcolor=silver>Operation Type</th>                    
                            <th bgcolor=silver>From account</th>                    
                            <th bgcolor=silver>To account</th>  
                            <th bgcolor=silver>Amount</th>                
                            <th bgcolor=silver>Result balance</th> 
                            <th bgcolor=silver>Date committed</th>
                            <th bgcolor=silver colspan="3"/>                                
                        </tr>
                        <tr style="background: silver;">
                            <td>Filter </td>
                            <td><input id="fromAccountFilter" class="search_init" /></td>
                            <td><input id="toAccountFilter" class="search_init" /></td>                   
                            <td><input id="amountFilter" class="search_init" /></td>                    
                            <td><input id="balanceFilter" class="search_init" /></td>                    
                            <td>
                                <input id="minDateFilter" name="minDateFilter" class="search_init" />
                                <input id="maxDateFilter" name="maxDateFilter" class="search_init" />
                            </td>
                            <td colspan="3"/>
                        </tr> 
                    </thead>
                    <tbody>                          
                        <c:set var="items" scope="page" value="${myCustomerId>0 
                                    ?bankTransactionsBean.getCustomerBankTransactions(myCustomerId)
                                    :bankTransactionsBean.getAll()}"/>
                        <c:set var="start" scope="session" value="1"/>  
                        <c:set var="chunkSize" scope="page" value="10"/>                        
                        <c:set var="totalSize" scope="page" value="50" /> 
                        <c:if test="${param.start>0}" >
                            <c:set var="start" scope="page" value="${param.start}"/>
                        </c:if>
                    
                        <c:forEach var="transaction" begin="${start}" end="${start + chunkSize - 1}" 
                                   items="${items}">
                            <tr>
                                <td>
                                   ${bankTransactionsTypeBean.getDetails(transaction.txTypeId)}
                                </td>
                                <td>${transaction.accountId}&nbsp;&nbsp;</td>
                                <td>${transaction.targetAccountId}&nbsp;&nbsp;</td>
                                <td>${transaction.amount}&nbsp;&nbsp;
                                    ${domainHelperBean.getCurrencyByCode(transaction.currencyId).getSymbol()}
                                </td>
                                <td>${transaction.balance}&nbsp;&nbsp;</td>
                                <td colspan="2">${transaction.timeStamp}&nbsp;&nbsp;</td>
                                <td><a href="javascript:viewRecord(${transaction.txId});" >
                                        <strong>View</strong>
                                    </a>
                                </td>
                                <td><a href="javascript:deleteRecord(${account.accountId});" name="delete" >
                                        <strong>Delete</strong>
                                    </a>
                                </td>
                            </tr>
                        </c:forEach>                         
                        
                        <c:forEach var="i" begin="1" end="${totalSize - 1}" step="${chunkSize}">  
                          <a href="?command=viewTransactionsList&start=<c:out value="${i}"/>" >
                             <b>  
                               (<c:out value="${i}"/>-<c:out value="${i + chunkSize - 1}"/>)
                             </b>                      
                         </a>  
                        </c:forEach>
                    </tbody>	
                </table>            
            </div>
        </form>
    </body>
</html>
